<!--
 * @Author: wangming
 * @Date: 2020-09-15 15:28:21
 * @LastEditors: wangming
 * @LastEditTime: 2022-05-30 10:13:37
 * @Description: file content
-->
<template>
  <div :style="{ width: config.__config.width + '%' }">
    <el-cascader
      :disabled="disabled || viewInfo"
      clearable
      :show-all-levels="false"
      :placeholder="config.__config.placeholder"
      :value="datas"
      @change="chnages"
      :options="treeData"
      style="width: 100%"
      popper-class="hm-cascader-popper"
      :props="{
        value: 'uniqueKey',
        emitPath: false,
        multiple: config.__config.multiple,
        checkStrictly: true,
        lazy: true,
        lazyLoad: loadNode,
      }"
    ></el-cascader>
  </div>
</template>
<script>
import myMixin from "@/pageComponents/myMixin";
import vmMixin from "@/pageComponents/vmMixin";
import { merge } from "lodash";
import {
  postHmhttprequestdefinitionExecute,
  putHmhttprequestdefinitionTreesearch,
} from "@/apis/paas/HmHttpRequestDefinitionController.js";
import { dataToList } from "@/utils/util";
import { getVueComponent } from "@/utils/common.js";
export default {
  mixins: [myMixin, vmMixin],
  vmEvents: {
    reload() {
      this.treeData = [];
      this.getTree();
    },
    addSearchData(queryData) {
      this.queryData = merge({}, this.queryData, queryData);
    },
  },
  mounted() {
    this.getTree();
  },
  computed: {
    datas() {
      if (this.config.__config.multiple) {
        let list = (this.value + "").match(/[\w\u4e00-\u9fa5-]+/g) || [];
        return list.map((i) => `[${i}]`);
      } else {
        return this.value;
      }
    },
    dataLoadFunction() {
      const { dataCustomLoadFn } = this.config.__config;
      return getVueComponent(dataCustomLoadFn);
    },
  },
  data() {
    return {
      treeData: [],
      queryData: {
        modelKey: this.config.__config.modelCode,
        key: "selectTree",
        values: {
          _RELATION_TYPE_: "BUSINESS",
          modelCode: this.config.__config.modelCode,
        },
      },
    };
  },
  methods: {
    async getLazyLoadTree(id) {
      let tree;
      if (!!this.config.__config.modelCode) {
        tree =
          (await putHmhttprequestdefinitionTreesearch(
            merge(
              {
                displayRule: this.config.__config.valueTeam,
                nodeId: id == undefined ? 0 : id,
              },
              { modelCode: this.config.__config.modelCode }
            )
          )) || [];
      }
      this.TransformTree(tree);
      return tree;
    },
    async loadNode(node, resolve) {
      const { dataCustomLoad, dataCustomLoadFn } = this.config.__config;
      if (node.level === 0) {
      }
      if (node.level >= 1) {
        let treeData;
        if (dataCustomLoad && dataCustomLoadFn) {
          treeData = await this.getLazyLoadTreeCustom(node.data.id);
        } else {
          treeData = await this.getLazyLoadTree(node.data.values.id);
        }
        return resolve(treeData);
      }
    },
    chnages(v) {
      if (this.config.__config.multiple) {
        this.$emit("input", v.join(""));
      } else {
        this.$emit("input", v);
      }
    },
    async getLazyLoadTreeCustom(id) {
      let tree;
      const { relationType, valueTeam, modelCode, dataCustomLoadFn } =
        this.config.__config;
      let options = await this.dataLoadFunction(
        id == undefined ? 0 : id,
        this.vmEvents?.context,
        this.vmEvents?.exports,
        {
          type: relationType,
          value: relationType === "DICTIONARY" ? valueTeam : modelCode,
        }
      );
      tree = this.TransformTree(dataToList(options));
      return tree;
    },
    async getTree() {
      if (this.queryData.modelKey) {
        let tree;
        if (
          this.config.__config.dataCustomLoad &&
          this.config.__config.dataCustomLoadFn
        ) {
          tree = await this.getLazyLoadTreeCustom();
        } else {
          // const tree =
          //   (await postHmhttprequestdefinitionExecute(this.queryData, {
          //     useCache: true,
          //   })) || [];
          tree = await this.getLazyLoadTree();
          // if (Object.prototype.toString.call(tree) === "[object Object]") {
          //   this.treeData = [tree];
          // } else {
          //   this.treeData = tree || [];
          // }
          // this.treeData = this.TransformTree(this.treeData);
        }
        this.treeData = tree;
      }
    },
    TransformTree(list) {
      return list.map((i) => {
        if (!i.uniqueKey) {
          i.uniqueKey = i.id;
        }
        i.uniqueKey = "[" + i.uniqueKey + "]";
        if (i?.children?.length > 0) {
          i.children = this.TransformTree(i.children);
        } else {
          delete i.children;
        }
        return i;
      });
    },
  },
};
</script>
<style lang="scss">
.hm-cascader-popper {
  .el-cascader-menu__list {
    &.is-empty {
      height: 50px;
    }
  }
}
</style>
